<template>
  <view class="page">
    <view
      v-for="(shop, index) in shops"
      :key="index"
      class="shop-item"
    >
      <image
        src="../../static/logo.png"
        class="shop-avatar"
      />
      <navigator
        :url="`/pages/chat/chat?id=${shop.userId}`"
        class="shop-link"
      >
        {{ shop.username }}
      </navigator>
    </view>
  </view>
</template>

<script>
export default {
  data () {
    return {
      shops: [
        { id: 1, name: '商家1' },
        { id: 2, name: '商家2' },
        { id: 3, name: '商家3' }
      ]
    }
  },
  created () {
    this.fetchShops()
  },
  methods: {
    fetchShops () {
      const userId = '5f159317be5b4dc4bf3188f1a3da0369'
      console.log(window.localStorage.userId)
      http.request({
        url: '/msg/GetShopList',
        method: 'GET'
      })
        .then(({ data }) => {
          console.log('2')
          console.log(data)
          this.shops = data
        })
    }
  }
}

</script>

<style scoped lang="scss">
@use "./shopper.scss";
</style>
